Vue.component("data-view", {
    data(){
      return {
        total:0,
        cpage:1,
        tabledata:[],
        datebe:[],
        sval:"",
        itemid:"",
        ext1:"",
        ext2:"",
        ext3:""
      }
    },
    props:["path", "col", "hidelist", "showitem", "pval", "vt"],
    template:`<div style="margin:20px;">
      <el-date-picker v-model="datebe" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期" format="yyyy 年 MM 月 dd 日" value-format="yyyy-MM-dd""></el-date-picker>
      <el-input v-model="sval" placeholder="UserID/昵称"></el-input>
      <el-input v-if="showitem" v-model="itemid" placeholder="道具ID"></el-input>
      <el-button type="primary" plain @click="opendata(1)">查询</el-button>
      <div v-if="vt==1">
        <el-input v-model="ext1" placeholder="邮件标题"></el-input><br/>
        <el-input v-model="ext2" type="textarea" placeholder="邮件内容"></el-input>
        <el-input v-model="ext3" placeholder="邮件附件" style="width:400px"></el-input>
      </div>
      <pre v-if="hidelist">{{tabledata.view}}</pre>
      <el-table v-if="!hidelist" :data="tabledata" style="width: 100%" @cell-click="cellclick">
        <el-table-column v-for="(item,index) in col" :key="index" :prop="index" :label="item"></el-table-column>
      </el-table>
      <el-pagination v-if="!hidelist" background :page-size="100" :current-page.sync="cpage" layout="prev, pager, next" :total="total" @current-change="opendata"></el-pagination>
    </div>`,
    methods:{
      opendata:function(pg){ //请求数据
        //console.log("opendata", this, this.path, this.datebe);
        let $this = this;
        $this.cpage = pg;
        if(this.tabledata.view) this.tabledata.view = "";
        axios.get("/ajax/" + this.path + "?V=" + this.sval + "&I=" + this.itemid + "&B=" + (this.datebe[0] || "") + "&E=" + (this.datebe[1] || "") + "&P=" + pg + "&E1=" + this.ext1 + "&E2=" + this.ext2 + "&E3=" + this.ext3).then(function(res){
          if("total" in res.data){
            $this.total = res.data.total | 0;
            $this.tabledata = res.data.data;
          }else{
            $this.tabledata = res.data;
          }
        });
      },
      cellclick:function(row,col,cell){ //点击了单元格
        if(this.col[0] == "UserID" && cell.cellIndex == 0){
          console.log("UserID", cell.innerText);
          this.$emit('showmenu', 1, 1, cell.innerText);
        }
      }
    },
    created:function(){
      console.log("created ", this.pval, " sval ", this.sval);
      if(this.pval){
        this.sval = this.pval;
        this.opendata(1);
      }
    }
  });